<style lang="less">
  .el-collapse-item {
    border: 1px solid #dfe6ec;
    margin-bottom: 10px;
    .el-collapse-item-span{
      height: 200px;
      background-color: #F2F2F2;
      margin: 20px 20px 10px 30px;
      .span-title{
        padding: 20px;
        .type-title{
          font-size: 18px;
          font-weight: 600;
        }
      }
      .span-value{
        padding-left: 20px;
        .span-value-text{
          font-size: 16px;
        }
        .span-value-input{
          height: 35px;
          width: 80px;
          margin-left: 10px;
          margin-right: 10px;
          font-size: 16px;
          font-weight: 600;
        }
      }
    }
    .el-collapse-item-btn{
      height: 50px;
      margin: 20px 20px 10px 40px;
    }
  }
  /*而要用 <el-dialog*/
       /*title="提示"*/
  /*:visible.sync="dialogVisible" 去控制*/
</style>

<template>
  <div class="el-collapse-item">
    <div class="el-collapse-item-span" style="height: 150px">
      <input type="integer" v-model="ageingWarningNotDepartForm.warningType" style="display: none"/>
      <div class="span-title"><label class="type-title">未发车告警天数设置:</label></div>
      <div class="span-value"><label class="span-value-text">以发运日期为起点，超出 </label><input type="number" v-model="ageingWarningNotDepartForm.value" step="0.5" min="0" max="10" class="span-value-input"/><label class="span-value-text"> 天未发车时，系统提示告警信息</label></div>
    </div>
    <div class="el-collapse-item-span">
      <input type="integer" v-model="ageingWarningNotSignOffForm.warningType" style="display: none"/>
      <div class="span-title"><label class="type-title">未签收告警天数设置:</label></div>
      <div class="span-value" style="padding-bottom: 20px"><label class="span-value-text">以发运日期为起点，超出<u>告警天数</u>未签收时，系统提示告警信息</label></div>
      <div class="span-value"><label class="span-value-text">告警天数 = 运价文件维护的时效范围取最大天数+</label><input type="number" v-model="ageingWarningNotSignOffForm.value" step="0.5" min="0" max="10" class="span-value-input"/><label class="span-value-text"> 天</label></div>
    </div>
    <div class="el-collapse-item-btn">
      <el-button  type="primary" style="width: 100px;height: 35px" @click="saveAgeingWarningMethod">保存</el-button>
    </div>
  </div>
</template>
<script>
import {
  saveAgeingWarning,
  findByWarningType
} from '../../api/v3/StmAgeingWarning';
export default {
  data () {
    return {
      WARN_TYPE_NOT_DEPART: 110008001, // 告警类型-未发车
      WARN_TYPE_NOT_SIGN_OFF: 110008002, // 告警类型-未签收
      ageingWarningNotDepartForm: {
        id: '',
        warningType: 110008001,
        warningTypeName: 110008001,
        value: 0.5,
        effective: 111002001
      },
      ageingWarningNotSignOffForm: {
        id: '',
        warningType: 110008002,
        warningTypeName: 110008002,
        value: 1,
        effective: 111002001
      }
    };
  },
  methods: {
    // 根据类型获取告警记录
    getAgeingWarningNotDepart () {
      findByWarningType({'warningType': this.WARN_TYPE_NOT_DEPART}).then((res) => {
        if (res.data) {
          this.ageingWarningNotDepartForm = res.data;
        }
      });
    },
    getAgeingWarningNotSignOff () {
      findByWarningType({'warningType': this.WARN_TYPE_NOT_SIGN_OFF}).then((res) => {
        if (res.data) {
          this.ageingWarningNotSignOffForm = res.data;
        }
      });
    },
    saveAgeingWarningMethod () {
      saveAgeingWarning([this.ageingWarningNotDepartForm, this.ageingWarningNotSignOffForm]).then((res) => {
        if (res.data) {
          this.$message.success('保存成功');
        }
      }).catch(function (error) {
        this.$message.error('保存失败:' + error);
      });
    }
  },
  // 初始化数据
  mounted () {
    this.getAgeingWarningNotDepart();
    this.getAgeingWarningNotSignOff();
  }
};
</script>
